<template>
  <div class="categorylist">
    <van-nav-bar
      title="零食"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
    ></van-nav-bar>
    <!-- <van-tabs v-model="active" sticky>
      <template
      :default-active="this.$route.path"
      class="el-menu-demo"
      mode="horizontal"
      @select="handleSelect"
      router
      background-color="#fff"
      text-color="#333"
      active-text-color="#0084ff"
    >
      <van-tab
        v-for="(item, i) in navList"
        :key="i"
        :index="item.name"
        @select="handleSelect">
        <template slot="title">
          <span>{{ item.navItem }}</span>
        </template>
      </van-tab>
      <template class="detailed-content">
        <router-view />
      </template>
    </van-tabs> -->
  </div>
</template>

<script>
export default {
  name: 'CategoryList',
  data () {
    return {
      active: 2,
      navList: [
        { name: '/categorylist/popularity', navItem: '人气排序' },
        { name: '/categorylist/price', navItem: '价格排序' },
        { name: '/categorylist/screen', navItem: '筛选商品' }
      ]
    }
  },
  methods: {
    onClickLeft () {
      this.$router.back()
    },
    handleSelect (key, keyPath) {
      console.log(key, keyPath)
    }
  }
}
</script>

<style lang="less" scoped>
</style>
